<!DOCTYPE html>
<html>
    <head>
        <script src="../../resources/js-test.js"></script>
    </head>
    <body>
        <p>
            Should not wrap when zooming out.
        </p>
        <div style="width: 100px;">
            <div id="col-a" style="width: 20px; margin-right: 1px; float: left; background: blue;">A</div>
            <div style="float: left;">
                <div id="col-b" style="width: 79px; background: green;">B</div>
            </div>
        </div>
        <script>
            var elementA = document.getElementById('col-a');
            var elementB = document.getElementById('col-b');
            for (var zoom = 5; zoom <= 100; zoom += 5) {
                document.body.style.zoom = zoom / 100;
                if (elementA.getBoundingClientRect().top == elementB.getBoundingClientRect().top)
                    testPassed('At ' + zoom + '% zoom elements are on the same line.');
                else
                    testFailed('At ' + zoom + '% zoom elementA.top is ' + elementA.getBoundingClientRect().top + ' and elementB.top is ' + elementB.getBoundingClientRect().top + '.');
            }
        </script>
    </body>
</html>
